Skip to main content

MobileCalendar Component

Created by: James Liu Created time: March 27, 2024 1:35 PM Tags: Frontend, Mobile, UI

Overview

MobileCalendar is a React component designed specifically for mobile devices to display and interact with a weekly calendar. It extends the functionality of the Calendar component into a mobile-friendly format, utilizing a swiping gesture for navigation between days of the week and animated transitions for showing or hiding the calendar. It integrates the Swiper component for smooth, touch-enabled sliding between days.

Refer to the Calendar component for functionality (linked below), can be functionally treated the same (props and functions are exactly the same). Key differences include no support for drag searching (selecting time queries), and an implementation of the calendar as a swiper between days for ease of use on mobile.

Frontend: Calendar & DayColumn Components